ページ移動の小技2 任意のページ数だけ移動する
前回は「戻る」「進む」「更新」および「トップページへ移動」ボタンの作成方法を紹介しました。
JavaScriptでは、これら以外にも「history.go()」という命令を使ってページを移動することができます。
今回は、この「history.go()」の使い方を紹介していきましょう。

→ history.go()で好きなページ数だけ戻る、進む
 
JavaScript「history.go()」は、カッコ内の入力された数値と同じだけページを進む、または戻る機能を有しています。
たとえば「history.go(2)」は2ページ進む、「history.go(-1)」は1ページ戻る、という具合に表示されるページが移動します。
つまり、JavaScript「history.go()」を、前回と同様にonClickイベントでボタンに追加してやれば、任意のページ数だけ移動させるボタンを作成できるわけです。
<INPUT type="button" value="2ページ戻る" onClick="history.go(-2)">
<INPUT type="button" value="1ページ戻る" onClick="history.go(-1)">
<INPUT type="button" value="1ページ進む" onClick="history.go(1)">
<INPUT type="button" value="2ページ進む" onClick="history.go(2)">


→ history.go()でページを更新する
 
また、「history.go()」を使ってページの更新を行うことも可能です。
この場合「history.go()」のカッコ内の数値は「0」となります。
こうすると、0ページぶんだけ前に進む(または戻る?)という動作が行われ、結果的にはページが更新されることになります。
<INPUT type="button" value="2ページ戻る" onClick="history.go(-2)">
<INPUT type="button" value="1ページ戻る" onClick="history.go(-1)">
<INPUT type="button" value="更新" onClick="history.go(0)">
<INPUT type="button" value="1ページ進む" onClick="history.go(1)">
<INPUT type="button" value="2ページ進む" onClick="history.go(2)">


→ history.go()で任意のページへ移動する
 
「history.go()」のカッコ内にURLを記述すると、指定されたURLへジャンプする機能を実現することができます。
ただし、これは指定されたURLが履歴として記録されている場合に限ります。
たとえば「history.go('http://www.infoseek.co.jp/')」とすると、infoseekのページへジャンプすることができますが、ブラウザを起動した後に一度もinfoseekのページを見ていない場合(「戻る」または「進む」でinfoseekのページを表示できない状態)では何もおこりません。
<INPUT type="button" value="2ページ戻る" onClick="history.go(-2)">
<INPUT type="button" value="1ページ戻る" onClick="history.go(-1)">
<INPUT type="button" value="更新" onClick="history.go(0)">
<INPUT type="button" value="1ページ進む" onClick="history.go(1)">
<INPUT type="button" value="2ページ進む" onClick="history.go(2)">
<BR><BR>
<INPUT type="button" value="トップページへ" onClick="history.go('http://iswebmag.hp.infoseek.co.jp/')">
<BR>
<FONT size="2" color="#FF0000">※[トップページへ]ボタンは、ブラウザ起動後に『魅せるホームページ作成講座』を見ている場合に限り有効です。</FONT>

e[NECir Yahoo yV LINEf[^[z500~`I
z[y[W NWbgJ[h COiq@COsI COze